<?php include("model-db-connection/DBConnection.inc"); ?>
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="ie lt-ie9 lt-ie8 lt-ie7 "> <![endif]-->
<!--[if IE 7]>    <html class="ie lt-ie9 lt-ie8 "> <![endif]-->
<!--[if IE 8]>    <html class="ie lt-ie9 "> <![endif]-->
<!--[if gt IE 8]> <html class="ie "> <![endif]-->
<!--[if !IE]><!--><html class=""><!-- <![endif]-->
    <head>
        <title>Out Source Building Management</title>

        <!-- Meta -->
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">


        <!-- 
        **********************************************************
        In development, use the LESS files and the less.js compiler
        instead of the minified CSS loaded by default.
        **********************************************************
        <link rel="stylesheet/less" href="assets/less/admin/module.admin.stylesheet-complete.less" />
        -->

        <!--[if lt IE 9]><link rel="stylesheet" href="assets/components/library/bootstrap/css/bootstrap.min.css" /><![endif]-->
        <link rel="stylesheet" href="assets/css/admin/module.admin.stylesheet-complete.min.css" />

        <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
          <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
        <![endif]-->


        <script src="assets/components/library/jquery/jquery.min.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/library/jquery/jquery-migrate.min.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/library/modernizr/modernizr.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/plugins/less-js/less.min.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/modules/admin/charts/flot/assets/lib/excanvas.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/plugins/browser/ie/ie.prototype.polyfill.js?v=v1.0.2&sv=v0.0.1"></script>	<script>if (/*@cc_on!@*/false && document.documentMode === 10) {
                document.documentElement.className += ' ie ie10';
            }</script>
        <script src="assets/components/library/bootstrap/js/bootstrap.min.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/plugins/nicescroll/jquery.nicescroll.min.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/plugins/breakpoints/breakpoints.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/plugins/preload/pace/pace.min.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/plugins/preload/pace/preload.pace.init.js?v=v1.0.2&sv=v0.0.1"></script>
        <script src="assets/components/core/js/animations.init.js?v=v1.0.2"></script>
        <script src="assets/components/core/js/core.init.js?v=v1.0.2"></script>

    </head>
    <body class=" loginWrapper">

        <!-- Main Container Fluid -->
        <div class="container-fluid menu-hidden">
            <!-- Content -->
            <div id="content">
                <!-- row-app -->
                <div class="row row-app">

                    <!-- col -->
                    <!-- col-separator.box -->
                    <div class="col-separator col-unscrollable box">

                        <!-- col-table -->
                        <div class="col-table">

                            <!-- col-table-row -->
                            <div class="col-table-row">

                                <!-- col-app -->
                                <div class="col-app col-unscrollable">

                                    <!-- col-app -->
                                    <div class="login">
                                        <div class="col-app">

                                            <div class="placeholder text-center"><i class="fa fa-lock"></i></div>
                                            <div class="panel panel-default col-md-4 col-sm-6 col-sm-offset-3 col-md-offset-4"><br>
                                                <div class="alert alert-success" id="login-success">
                                                    <button type="button" class="close" id="login-success-close-noti">×</button>
                                                    <div id="login-success-detail"></div>
                                                </div>
                                                <div class="alert alert-danger" id="login-fail">
                                                    <button type="button" class="close" id="login-fail-close-noti">×</button>
                                                    <div id="login-fail-detail"></div>
                                                </div>
                                                <form id="loginForm">
                                                    <div class="panel-body">
                                                        <div class="form-group">
                                                            <label for="username">ชื่อผู้ใช้</label>
                                                            <input type="text" class="form-control" name="username" id="username" placeholder="Enter Username">
                                                        </div>
                                                        <div class="form-group">
                                                            <label for="password">รหัสผ่าน</label>
                                                            <input type="password" class="form-control" id="password" name="password" placeholder="Enter Password">
                                                        </div>

                                                        <button type="button" id="submit" class="btn btn-primary btn-block">เข้าสู่ระบบ</button>
                                                    </div>
                                                </form>
                                            </div>

                                            <div class="clearfix"></div>

                                        </div>


                                    </div>
                                    <!-- // END col-app -->

                                </div>
                                <!-- // END col-app.col-unscrollable -->

                            </div>
                            <!-- // END col-table-row -->

                        </div>
                        <!-- // END col-table -->

                    </div>
                    <!-- // END col-separator.box -->


                </div>
                <!-- // END row-app -->

                <script type="text/javascript">
            $(document).ready(function() {
                $("#username, #password").val("");
                $("#login-success, #login-fail").hide();
                $("#submit").click(function() {
                    if ($("#username").val() == "" || $("#password").val() == "") {
                        $("#login-fail").show("fast");
                        $("#login-fail-detail").html("กรุณาใส่ Username กับ Password ให้ถูกต้อง");
                        $("#login-success").hide("fast");
                    } else {
                        var data = $("#loginForm").serialize();
                        var jqxhr = $.post("model/VerifyUsernameAndPassword.php?" + data);
                        jqxhr.success(function(data) {
                            if (data == 1) {
                                $("#login-success").show("fast");
                                $("#login-success-detail").html("ยินดีต้อนรับคุณ " + $("#username").val());
                                $("#username, #password").val("");
                                $("#login-fail").hide("fast");
                                window.location.assign("index-mainpage.php?lang=th")
                            }
                            if (data == 2) {
                                $("#login-fail-detail").html("");
                                $("#login-fail").show("fast");
                                $("#login-fail-detail").html("Username หรือ Password ผิดพลาด");
                                $("#login-success").hide("fast");
                            }
                        });
                        jqxhr.error(function() {
                            $("#login-fail-detail").html("");
                            $("#login-fail").show("fast");
                            $("#login-fail-detail").html("ไม่สามารถเชื่อมต่อกับ Server ได้");
                            $("#login-success").hide("fast");
                        });
                    }
                });
                $("#login-fail-close-noti").click(function() {
                    $("#login-fail").hide("fast");
                });
                $("#login-success-close-noti").click(function() {
                    $("#login-success").hide("fast");
                });

            });
                </script>
                </body>
                </html>